import React from 'react'
import { Row, Col, Card, Button } from 'antd';
import { ClockCircleOutlined } from '@ant-design/icons'

import './activity.less'
const { Meta } = Card;

export default class Activity extends React.Component {
    state = {}
    onDetail=()=>{
        this.props.history.push('/detail')
    }
    onHeart = () => {
        this.props.history.push('/work')
    }
    render() {
        return (
            <div>
                <div>
                    <img className='img-responsive' src="https://z3.ax1x.com/2021/07/13/WknkFS.png" />
                </div>

                <div style={{ padding: "30px" }}>
                    <Row justify="center"  >
                       
                        <Col span={7} >
                            <div style={{ padding: "0 20px" }}>
                                <Card
                                    cover={
                                        <div style={{ position: 'relative' }}>
                                            <img className='img-responsive1' src="https://z3.ax1x.com/2021/08/06/fnhPY9.png" />
                                            <img className='img-responsive2' src="https://z3.ax1x.com/2021/08/06/fnhpo4.png" />
                                        </div>

                                    }

                                >
                                    <Meta title="响帮帮爱心互助信息平台" description="2021年7月20日，一场百年不遇的特大暴雨突降河南，导致多个地区节奏骤乱，城区内涝频现..." />
                                    <div style={{ paddingTop: 30 }}>
                                        <Button type="primary" shape="round" onClick={this.onDetail}> 报名中</Button>
                                        <span style={{ float: 'right', color: '#BCBCBC', paddingTop: 5 }}>
                                            <ClockCircleOutlined /> 2021-06-01至2021-08-15
                                        </span>
                                    </div>
                                </Card>
                            </div>
                        </Col>

                        <Col span={7} >
                            <div style={{ padding: "0 20px" }}>
                                <Card
                                    cover={
                                        <div style={{ position: 'relative' }}>
                                            <img className='img-responsive1' src="https://z3.ax1x.com/2021/08/06/fnhCFJ.png" />
                                            <img className='img-responsive2' src="https://z3.ax1x.com/2021/08/06/fnhpo4.png" />
                                        </div>
                                    }
                                >
                                    <Meta title="零钱大计划2021校园招聘" description="2021校园招聘活动火热进行中。响帮帮灵活用工联合各大电子厂开启校园招聘。" />
                                    <div style={{ paddingTop: 30 }}>
                                    <Button type="primary" shape="round" onClick={this.onHeart}> 报名中</Button>
                                        <span style={{ float: 'right', color: '#BCBCBC', paddingTop: 5 }}>
                                            <ClockCircleOutlined /> 2021-06-01至2021-08-15
                                        </span>
                                    </div>
                                </Card>
                            </div>
                        </Col>
                    </Row>


                </div>
            </div>
        )
    }
}